<!--
 * @Author: your name
 * @Date: 2021-07-05 15:38:11
 * @LastEditTime: 2021-07-05 16:16:39
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \echarts\Koa_Server\websocket_demo.html
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button id="connect">连接</button>
    <button id="send" disabled="true">发送数据</button><br>
    从服务端接收的数据如下:<br>
    <span id="recv"></span>
    <script>
        let ws=null;
        const connect=document.querySelector("#connect")
        const send=document.querySelector("#send")
        const recv=document.querySelector("#recv")
        connect.onclick=function(){
            ws=new WebSocket('ws://localhost:9998')
            ws.onopen=()=>{
            console.log("连接服务端成功了")
            send.disabled=false
            }
            ws.onclose=()=>{
            console.log("连接服务端失败")
            send.disabled=true
            }
            ws.onmessage=(msg)=>{
                console.log("接收到从服务端传过来的数据了")
                console.log(msg)
            } 
        }
        send.onclick=function(){
            ws.send('fdgjgkjjk')
            console.log("哈哈")
        }
       
        
    </script>
</body>
</html>